<template>
  <el-card class="box-card card-header m-t-20">
    <div slot="header" class="clearfix f-medium">
      <i class="fa fa-list m-r-10 text-c-blue" aria-hidden="true"></i>
      <span>所有记录列表</span>
    </div>
    <div>
      <TableCreator :colsConfig="columnConfig" :data="plansList" class="planTable" height="500" highlight-current-row
        @current-change="handleSelect"></TableCreator>
    </div>
  </el-card>
</template>

<script>
import { columnConfig } from '../config/allList-tableconfig'
import { mapState } from "vuex";
export default {
  name: "AllList",
  data() {
    return {
      columnConfig
    };
  },
  mounted() {
    this.$store.dispatch("cruiseRecord/toGetPlansList");
  },
  computed: {
    ...mapState("cruiseRecord", ["plansList"]),
  },
  methods: {
    handleSelect(row) {
      this.$store.commit("cruiseRecord/setCurrentPlan", row);
      this.$store.dispatch("cruiseRecord/toGetPlanRecord", row.id.toString());
    },
  },
};
</script>


<style scoped lang="less">
.card-header {
  /deep/ .el-card__header {
    border-left: 5px solid var(--blue);
  }
}
</style>